.space-container {
    margin-top: 60px;
    width: 100%;
    align-items: center;
    display: flex;
    flex-direction: column;
    background-color: $background-color;

    .space-imgBox {
        width: 70%;
        height: 749px;
        position: fixed;
        top: -50px;
        margin: 0 auto;
        box-shadow: inset 0 0 20px black;
    }

    >img {
        width: 70%;
        height: 749px;
        position: fixed;
        top: -50px;
        margin: 0 auto;
    }

    .space-content {
        width: 70%;
        position: absolute;
        background: white;
        top: 70vh;
        border-top-left-radius: 20px;
        border-top-right-radius: 20px;
        box-shadow: 0 0 15px -5px #6e6e6e;

        .space-title {
            @include column-center;
            width: 20%;
            margin: 0 auto;
            transform: translate3d(0, -35%, 0);

            span {
                @include text-inline;
                text-align: center;
                width: 100%;
                margin-top: 15px;
                letter-spacing: 5px;
                color: $sub-color;

                &:nth-of-type(1) {
                    color: $title-color;
                    font-size: $font-large;
                    font-weight: bold;
                }
            }

            img {
                border-radius: 50%;
                width: 50%;
            }
        }

        .space-info {
            width: 100%;
            display: flex;
            justify-content: space-around;
            transform: translate3d(0, -250%, 0);

            .space-info-item {
                @include column-center;
                margin: 0 50px;

                span {
                    letter-spacing: 5px;
                    color: $sub-color;

                    &:nth-of-type(1) {
                        color: $title-color;
                        font-size: large;
                        font-weight: bold;
                        color: $dark-blue;
                        padding: 10px;
                    }
                }

                &:hover span {
                    color: $blue;
                    cursor: pointer;
                }
            }

            .space-info-float {
                display: flex;
                flex-direction: row;
                justify-content: center;
                align-items: center;

                .space-divi {
                    width: 2px;
                    height: 70%;
                    margin-top: 5px;
                    background-color: $divider-color2;
                }
            }
        }

        .ivu-tabs {
            position: relative;
            top: -100px;

            .ivu-tabs-bar {
                display: flex;
                justify-content: center;
            }

            .space-goods-box {
                display: flex;
                justify-content: flex-start;
                flex-wrap: wrap;
                width: 85%;
                margin: 0 auto;
            }

            .space-com-box {
                display: flex;
                flex-direction: row;
                justify-content: space-around;
                width: 100%;

                .com-left {
                    width: 45%;
                }

                #divider {
                    width: 2px;
                    height: auto;
                    background: $divider-color2;
                }

                .com-right {
                    width: 45%;

                    .blog-item {
                        width: 100%;
                        background: none;
                        margin-bottom: 80px;
                    }
                }
            }
        }

        // 分页
        .ivu-page {
            text-align: center;
            margin-top: 10px;
        }
    }
}